import React from 'react'
export default class BillboardCreate extends React.Component{
    constructor(props){
        super(props);
        this.handleChange = this.handleChange.bind(this);
        this.state = {
            title : '',
            content : '',
            notification_all: false
        }
    }
    handleChange(props){
        const value = event.target.type === 'checkbox' ? event.target.checked : event.target.value;        
        this.setState(
            { [event.target.name] : value }
        )
    }
    render(){
        return (<div>
            <input type="text"
                value={this.state.title}
                className="form-control billBoardCreateTitle"
                placeholder="公告标题"
                name="title"
                onChange = {this.handleChange}
            />
            <div style={{height: '20px'}}/>
            <textarea type="text"
                value={this.state.content}
                placeholder="公告内容"
                name="content"
                onChange={this.handleChange}
                className="form-control billBoardCreateContent"
            />
            <div className="input-group">
                <div className="input-group-prepend billBoardCreateNotificationAll">
                  通知所有人
                </div>
                <input type="checkbox" 
                    name="notification_all" 
                    className="form-control form-control-sm" 
                    checked={this.state.notification_all}
                    onChange={this.handleChange}/>
            </div>
            <div className="billBoardCreateWarning">
                请慎重决定是否通知所有人，这将给所有用户发送一条无法撤回的服务通知
            </div>
            <div className="bottomButtonWrapper">
                    <button className="btn btn-primary">发布公告</button>
                </div>            
        </div>)
    }
}
